<template>
	<view class="mainpadding ffffff">
		<view class="titletext xiaohei nofonweight">原手机号</view>
		<view class="pdl margin_top flexbetween">
			<view class="titletext xiaohei nofonweight">+86</view>
			<input type="number" placeholder="请输入原手机号" disabled v-model="userInfo.mobile">
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" @click="sendyzm" v-show="codetext == 1">发送验证码</view>
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" v-show="codetext == 2">{{second}}s后重新获取</view>
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" @click="sendyzm" v-show="codetext == 3">重新发送</view>
		</view>
		<view class="titletext xiaohei nofonweight margin_top">验证码</view>
		<view class="pdl margin_top flexbetween">
			<input type="number" placeholder="请输入验证码"  v-model="y_captcha">
		</view>
		<view class="titletext xiaohei nofonweight margin_top">新手机号</view>
		<view class="pdl margin_top flexbetween">
			<view class="titletext xiaohei nofonweight">+86</view>
			<input type="number" placeholder="请输入新手机号" v-model="mobile">
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" @click="sendyzm2" v-show="codetext2 == 1">发送验证码</view>
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" v-show="codetext2 == 2">{{second2}}s后重新获取</view>
			<view class="xiaohong main_size nofonweight" style="min-width: 150rpx;" @click="sendyzm2" v-show="codetext2 == 3">重新发送</view>
		</view>
		<view class="titletext xiaohei nofonweight margin_top">验证码</view>
		<view class="xiahuaxian margin_top flexbetween">
			<input type="number" placeholder="请输入验证码" v-model="captcha">
		</view>
		<view class="posibottom mainpadding">
			<view class="submitbtn" style="background-color: 193, 40, 46;" @click="submit()">确定</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				codetext: 1,
				second: 59,
				codetext2: 1,
				second2: 59,
				userInfo:{},
				y_captcha:"",
				captcha:"",
			}
		},
		onShow() {
			this.userinfomsg()
		},
		methods: {
			// 发送验证码
			sendyzm() {
				let _this = this;
				
				httpRequest.request('/api/sms/send', 'POST', {
					mobile: this.userInfo.mobile,
					event: 'getchangemobile',
				}, false, true, false).then(res => {
					if (res.code == 1) {
						httpRequest.toast('发送成功')
						_this.codetext = 2;
						_this.second = 59;
						let timer = setInterval(function() {
							if (_this.second > 1) {
								_this.second--;
							} else {
								clearInterval(timer);
								_this.codetext = 3;
							}
						}, 1000)
					}else{
						httpRequest.toast(res.msg)
					}
				})
			},
			isMobile(value) {
				let a = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/.test(value); 
				return a;
			},
			sendyzm2() {
				let _this = this;
				if (_this.mobile == '') {
					httpRequest.toast("请输入手机号码!")
					return;
				}
				// if (!_this.isMobile(_this.mobile)) {
				// 	httpRequest.toast("手机号码格式错误!")
				// 	return;
				// }
				httpRequest.request('/api/sms/send', 'POST', {
					mobile: this.mobile,
					event: 'changemobile',
				}, false, true, false).then(res => {
					if (res.code == 1) {
						httpRequest.toast('发送成功')
						_this.codetext2 = 2;
						_this.second2 = 59;
						let timer = setInterval(function() {
							if (_this.second2 > 1) {
								_this.second2--;
							} else {
								clearInterval(timer);
								_this.codetext2 = 3;
							}
						}, 1000)
					}else{
						httpRequest.toast(res.msg)
					}
				})
			},
			userinfomsg() {
				httpRequest.request('/api/user/getUerInfo', 'GET', {}).then(res => {
					this.userInfo = res.data
				})
			},
			submit(){
				if(this.y_captcha==""){
					httpRequest.toast("请输入原手机验证码")
					return false
				}
				if(this.mobile==""){
					httpRequest.toast("请输入新手机号");
					return false;
				}
				// if(!this.isMobile(this.mobile)){
				// 	httpRequest.toast("手机号码格式错误!")
				// 	return;
				// }
				if(this.captcha==""){
					httpRequest.toast("请输入新手机验证码")
					return false
				}
				httpRequest.request('/api/user/changemobile','GET',{
					mobile:this.mobile, 
					captcha:this.captcha,
					y_captcha:this.y_captcha
				}).then(res => {
					httpRequest.toast(res.msg);
					if(res.code == 1){
						uni.clearStorageSync()
						setTimeout(()=>{
							uni.navigateBack({
								delta:2
							})
						},1000)
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>
